<template>
    <view class="bg-content">
        <u-popup v-model="isShowActionSheet" mode="bottom" :closeable="true" height="500px">
            <div style="text-align: center; font-size: 20px; margin-top: 20px; margin-bottom: 20px;">
                店铺优惠券
            </div>
            <view class="taobao" v-for="(item, index) of tbStoreCouponList" :key="item.id">
                <!--<view class="title">-->
                <!--<view class="left">-->
                <!--<image class="buddha" src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1975388697,1068670603&fm=26&gp=0.jpg" mode="aspectFill"></image>-->
                <!--<view class="store">袜子精保护协会</view>-->
                <!--</view>-->
                <!--<view class="entrance">进店</view>-->
                <!--</view>-->
                <view class="ticket">
                    <view class="left">
                        <!--<image-->
                        <!--class="picture"-->
                        <!--src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1578059523488&di=5f592ac19c1b983005d3e85add469756&imgtype=0&src=http%3A%2F%2Fimg010.hc360.cn%2Fg7%2FM00%2F2D%2FB9%2FwKhQs1QfUo6EdeM-AAAAALwk1hM072.jpg"-->
                        <!--mode="widthFix"-->
                        <!--&gt;</image>-->
                        <view class="introduce">
                            <view class="top">
                                ￥
                                <text class="big">{{item.couponMoney | toFixed2}}</text>
                                满{{item.orderMoney | toFixed2}}元减{{item.couponMoney | toFixed2}}元
                            </view>
                            <view class="type">店铺优惠券</view>
                            <view class="date u-line-1">{{item.startTime}}-{{item.endTime}}</view>
                        </view>
                    </view>
                    <view class="right">
                        <view class="use immediate-use" :round="true" @click="getCoupon(item)">点击领取</view>
                    </view>

                </view>
            </view>
            <div>
                <table class="table" v-if="!tbStoreCouponList.length">
                    <tr>
                        <td style="vertical-align: middle; text-align: center; line-height: 1.8;">
                            优惠券被领光啦！
                        </td>
                    </tr>
                </table>
            </div>
        </u-popup>
    </view>
</template>

<script>

    import {TbStoreCouponService} from "../dev/services/tb-store-coupon.service";
    import {TbOrderCouponService} from "../dev/services/tb-order-coupon.service";

    export default {
        data() {
            return {
                storeId: null, // 商品的storeId
                isShowActionSheet: false,
                tbStoreCouponList: []
            }
        },
        onLoad() {
            const _self = this
        },
        methods: {
            openStoreCouponSelect(storeId) {
                const _self = this;
                this.storeId = storeId;
                new TbStoreCouponService().findValidTbStoreCouponList({
                    storeId: storeId,
                    status: '1',
                    deleted: 0
                }).then(result => {
                    _self.tbStoreCouponList = result;
                    _self.isShowActionSheet = true;
                });
            },

            /**
             * 领取优惠券
             * @param item
             */
            getCoupon(item) {
                const _self = this;
                new TbOrderCouponService().saveTbOrderCoupon({
                    storeCouponId: item.id,
                }).then(result => {
                    uni.showModal({
                        title: '提示',
                        content: result.message,
                        showCancel: false
                    });
                    _self.isShowActionSheet = false;
                    _self.$emit('selectEmit')
                });
            },
        }
    }
</script>

<style lang="scss" scoped>
    @import "./tb-store-coupon-select.scss";
</style>
